<template>
	<view class="">


		<view class="gl-header">
			<view class="gl-header-left" @tap="lastSwiper">
				<uni-icons type="undo-filled" size="32" style="color: #4cd964;"></uni-icons>
				<view class="">返回</view>
			</view>
			<view class="gl-header-right">
				<!--
				<view v-if="curOrder.status === 1" class="gl-button gl-button-success" hover-class="button-base-hover"
					:hover-stay-time="100" @click="eventDelivery">
					<uni-icons type="reload" size="18" color="#fff"></uni-icons>
					<text style="font-size: small;">发货</text>
				</view>
				-->
				<view class="gl-button gl-button-base" hover-class="button-base-hover" :hover-stay-time="100"
					@click="refresh">
					<uni-icons type="reload" size="18" color="#fff"></uni-icons>
					<text style="font-size: small;">刷新</text>
				</view>
			</view>
		</view>
		<view class="gl-body">
			<view class="" style="display: flex;justify-content: space-between;">
				<uni-card title="订单详情" thumbnail="" note="Tips">
					<view class="" style="display: flex;">
						<uni-list>
							<uni-list-item title="订单号" clickable :rightText="curOrder.reqsn"
								@click="copyReqsnOrder(curOrder.reqsn)"></uni-list-item>
							<uni-list-item title="类型" :rightText="curOrder.ditch"></uni-list-item>
						</uni-list>
						<uni-list>
							<uni-list-item title="订单状态"
								:rightText="zipState(curOrder.status).name || ''"></uni-list-item>
							<uni-list-item title="支付方式" :rightText="curOrder.payment"></uni-list-item>
						</uni-list>
						<uni-list>
							<uni-list-item title="订单金额"
								:rightText="'￥'+(curOrder.fprice/100).toFixed(2)"></uni-list-item>
							<uni-list-item title="支付金额"
								:rightText="'￥'+(curOrder.aprice/100).toFixed(2)"></uni-list-item>
						</uni-list>
						<uni-list>
							<uni-list-item title="权益" :rightText="'level:'+curOrder.buy_level || '无'"></uni-list-item>
							<uni-list-item title="结算" :rightText="curOrder.is_foot === 1 ? '已结算':'未结算'"></uni-list-item>
						</uni-list>
						<uni-list>
							<uni-list-item title="兑换券" :rightText="curOrder.card_good || '无'"></uni-list-item>
							<uni-list-item title="代金券" :rightText="'ID:'+curOrder.card_money || '无'"></uni-list-item>
						</uni-list>
						<uni-list>
							<uni-list-item title="下单时间" :rightText="curOrder.created"></uni-list-item>
							<uni-list-item title="最近更新" :rightText="curOrder.lasttime"></uni-list-item>
						</uni-list>
						<uni-list>
							<uni-list-item title="客户" clickable @click="showStaff"
								:rightText="curOrder.order_staff?.id +' '+  curOrder.order_staff?.nicename || ''"></uni-list-item>
							<uni-list-item title="订单备注" :rightText="curOrder.note"></uni-list-item>
						</uni-list>
						<uni-section title="收货地址:">
							<template v-slot:right>
								<view class="">
									{{curOrder.order_addre?.name || ''}}
									{{curOrder.order_addre?.phone || ''}}
								</view>
							</template>
							<view @click="copyAddressEvent"
								style="display: flex;flex-direction: column;gap: 2px;font-size: x-small; padding-left: 10px;">

								<view class="">
									{{curOrder.order_addre?.sheng || ''}} {{curOrder.order_addre?.shi || ''}}
									{{curOrder.order_addre?.xian || ''}}
								</view>
								<view class="">
									{{curOrder.order_addre?.address || ''}}
								</view>
							</view>
						</uni-section>
					</view>
					<view v-if="curOrder?.id">
						<uni-segmented-control :current="curControl" :values="menuData"
							@clickItem="controlChange"></uni-segmented-control>
						<productCardVue v-if="curControl === 0" :data="curOrder.order_product"></productCardVue>
						<payCardVue v-if="curControl === 1" :data="curOrder.order_pay"></payCardVue>
						<repayCardVue v-if="curControl === 2" :data="curOrder.order_repay"></repayCardVue>
						<carryCardVue v-if="curControl === 3" :data="curOrder.order_carry" @eventCarry="eventCarryNew"></carryCardVue>
						<view v-if="curControl === 4" class="gl-empty-view"><text>功能开发中</text> </view>
						<view v-if="curControl === 5" class="gl-empty-view"><text>功能开发中</text> </view>
					</view>


				</uni-card>
			</view>
		</view>
		<!-- 模态弹窗 -->
		<uni-popup ref="popupCarry" border-radius="10px 10px 10px 10px">
			<popupCarryCardVue :reqsn="curOrder.reqsn" :order="curOrder.order" :pids="curPids" :prot="curPros"
				@eventAccept="eventSuccess" @eventClose="eventClose"></popupCarryCardVue>
		</uni-popup>

		<popStaffCardVue ref="popStaffCard"></popStaffCardVue>
		<popCarryCardVue ref="popCarry" @accept="refresh"></popCarryCardVue>

	</view>
</template>

<script>
	import models from '@/common/model.json';
	import psLib from '@/common/psLib';
	import psMethod from '@/common/psMethod';
	import productCardVue from '@/components/sub-order/product-card.vue';
	import payCardVue from '@/components/sub-order/pay-card.vue';
	import repayCardVue from '@/components/sub-order/repay-card.vue';
	import carryCardVue from '@/components/sub-order/carry-card.vue';
	import popupCarryCardVue from './popup-carry-card.vue';		 
	import popStaffCardVue from '@/components/pop-staff-card/pop-staff-card.vue';
	import popCarryCardVue from './pop-carry-card.vue';
	export default {
		data() {
			return {
				sConf: getApp().globalData,
				curOrder: this.orderMdb, // 当前订单

				curControl: 0,
				menuData: ['产品', '支付', '退款', '物流', '评论', '其他'],

				curPids: [], // 当前订单相关商户
				curPros: [], // 当前订单相关产品
			}
		},
		props: {
			orderMdb: {
				type: Object,
				default: () => JSON.parse(JSON.stringify(models.order))
			}
		},
		components: {
			popupCarryCardVue,
			productCardVue,
			payCardVue,
			repayCardVue,
			carryCardVue,
			popStaffCardVue, popCarryCardVue
		},
		methods: {
			eventCarryNew(){
				console.log('eventCarryNew', this.curOrder);
				this.$refs.popCarry.open(this.curOrder)
			},
			showStaff() {
				this.$refs.popStaffCard.open(this.curOrder?.order_staff)
			},
			zipStr(e) {
				return psLib.zipStr(e)
			},
			zipState(e) {
				return psLib.hasState(e)
			},
			loadDefData(e) {
				this.loadOrderList(e)
			},
			lastSwiper() {
				this.$emit('navIndex');
			},
			refresh() {
				this.loadOrderList(this.curOrder.id)
			},
			controlChange(e) {
				console.log('controlChange', e.currentIndex);
				this.curControl = e.currentIndex
			},
			async loadOrderList(e) {
				let host = this.sConf.host + '/admin/orderList/' + e + '/';
				let token = this.sConf.auth.token || '';
				let res = await psMethod.authenticatorGetSync(host, token).then(res => {
					console.log('加载订单', res);
					this.curOrder = res.resmsg
					let tmpData = []
					let proData = []
					res.resmsg.order_product.forEach(item => {
						proData.push(item)
						tmpData.push({
							value: item.ext_product.pid_place.id,
							text: item.ext_product.pid_place.nicename
						})
					})
					this.curPros = proData
					this.curPids = tmpData
				})
			},
			/**
			 * 发货
			 */
			eventDelivery() {
				console.log('eventDelivery');
				this.$refs.popupCarry.open()
			},
			eventClose() {
				this.$refs.popupCarry.close()
			},
			eventSuccess() {
				this.$refs.popupCarry.close()
				this.loadOrderList(this.curOrder.id)
			},
			/**
			 * 复制地址
			 */
			copyAddressEvent() {
				uni.setClipboardData({
					data: this.curOrder.order_addre?.name + ' ' + this.curOrder.order_addre?.phone + ' ' + this
						.curOrder.order_addre?.sheng +
						this.curOrder.order_addre?.shi + this.curOrder.order_addre?.xian + this
						.curOrder.order_addre?.address
				})
			},
			/**
			 * 复制订单号
			 */
			copyReqsnOrder(e) {
				uni.setClipboardData({
					data: e
				})
			}
		}
	}
</script>

<style lang="scss" scoped>

</style>